<template>
	<view class="control">
		<QSNavbar :navbarItems="navbarItems_1" backgroundColor="rgba(255, 255, 255, 0.0)"></QSNavbar>
		<!-- :style="{ backgroundImage: 'url('+backgroundImage+')' }" -->
		<view class="control_item">
			<!-- 会员办卡 -->
			<view v-if="type == 0">
				<view class="item-list1" v-for="(item,index) in list" :key="index" v-if="item.products != ''">
					<view class="list-title">
						{{item.venue.venue_name}}
					</view>
					<view class="font_2">
						{{item.venue.address}}
					</view>
					<view class="venues-list">
						<view class="venues-item" v-for="(item1,index1) in item.products" :key="index1"
							@click="memberCard(item1,item)">
							<image :src="item1.picture" style="width: 315rpx;height: 199rpx;" mode="aspectFill"></image>
							<view class="detail">
								<view class="name">{{item1.name}}</view>
								<view class="timer">
									<text style="font-size: 32rpx;color: #ff4811;font-weight: 700;margin-right: 10rpx;">
										{{item1.selling_price}}
									</text>
									<!-- <text style="text-decoration: line-through">￥{{item1.lineation}}</text> -->
								</view>
								<!-- <view class="tag-list flex-align">
								<u-tag v-for="(item2,index2) in item.marks" :key="index2" :text="item2.name" plain
									size="mini"> </u-tag>
							</view> -->
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 门票购买 -->
			<view v-if="type == 1">
				<view class="item-list" v-for="(item,index) in list" :key="index" v-if="item.products != ''">
					<view class="list-title">
						{{item.venue.venue_name}}
					</view>
					<view class="font_2">
						{{item.venue.address}}
					</view>
					<view class="venues-list">
						<view class="venues-item" v-for="(item1,index1) in item.products" :key="index1"
							@click="ticketModule(item1,item)">
							<image :src="item1.picture" style="width: 204rpx;height: 240rpx;" mode="aspectFill"></image>
							<view class="detail">
								<view class="name">{{item1.name}}</view>
								<view class="timer">
									<text style="font-size: 32rpx;color: #ff4811;font-weight: 700;margin-right: 10rpx;">
										{{item1.selling_price}}
									</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 场地预定 -->
			<view v-if="type == 2">
				<view class="item-list2" v-for="(item,index) in list" :key="index" v-if="item.products != ''">
					<view class="list-title">
						{{item.venue.venue_name}}
					</view>
					<view class="font_2">
						{{item.venue.address}}
					</view>
					<view class="venues-list">
						<view class="venues-item" v-for="(item1,index1) in item.products" :key="index1"
							@click="cdClick(item1,item)">
							<image :src="item1.show_img" style="width: 148rpx;height: 148rpx;" mode="aspectFill"></image>
							<view class="detail">
								<view class="name">{{item1.court_name}}</view>
								<!-- <view class="timer">
									<text style="font-size: 32rpx;color: #ff4811;font-weight: 700;margin-right: 10rpx;">
										{{item1.min_price}}
									</text>
								</view> -->
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 培训报班 -->
			<view v-if="type == 3">
				<view class="item-list3" v-for="(item,index) in list" :key="index" v-if="item.products != ''">
					<view class="list-title">
						{{item.venue.venue_name}}
					</view>
					<view class="font_2">
						{{item.venue.address}}
					</view>
					<view class="venues-list">
						<view class="venues-item" v-for="(item1,index1) in item.products" :key="index1"
							@click="trainlist(item1,item)">
							<image :src="item1.cover" style="width: 204rpx;height: 240rpx;border-radius: 5rpx;" mode="aspectFill"></image>
							<view class="detail">
								<view class="name">{{item1.name}}</view>
								<view class="timer">
									<text style="font-size: 32rpx;color: #ff4811;font-weight: 700;margin-right: 10rpx;">
										{{item1.price_selling}}
									</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 赛事报名 -->
			<view v-if="type == 8">
				<view class="item-list4" v-for="(item,index) in list" :key="index" v-if="item.products != ''">
					<view class="list-title">
						{{item.venue.venue_name}}
					</view>
					<view class="font_2">
						{{item.venue.address}}
					</view>
					<view class="venues-list">
						<view class="venues-item" v-for="(item1,index1) in item.products" :key="index1"
							@click="racelist(item1,item)">
							<image :src="item1.activity.race_img" style="width: 98%;height: 236rpx;" mode="aspectFill"></image>
							<view class="detail">
								<view class="name">{{item1.activity.race_name}}</view>
								<view class="timer">
									<text
										style="color: rgb(190,190,190);font-size: 22rpx;font-weight: 700;margin-right: 10rpx;">
										{{item1.activity.subtitle}}
									</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import QSNavbar from "@/components/QS-Navbar/QS-Navbar.vue";
	const venues = require("@/api/venues/venues.js");
	const index = require("@/api/index/index.js");
	const train = require("@/api/train/index.js");
	export default {
		components: {
			QSNavbar
		},
		data() {
			return {
				navbarItems_1: [{
						type: "icon",
						icon: "back",
						layout: "left",
						width: 15,
						doEvent: "back",
						iconColor: "#000000",
					},
					{
						type: "text",
						text: "",
						width: 70,
						weight: "bold",
						color: "#000000",
						textAlign: "left",
					},
				],
				cate_data: [],
				windows: '',
				list: [],
				type: ''
			}
		},
		onLoad(options) {
			this.windows = options.windows
			this.getVenusProduct()
		},
		methods: {
			async getVenusProduct() {
				let data = {
					app_id: this.$https.weixinAppId,
					project_id: getApp().globalData.projectId,
					window_id: this.windows,
				};
				let result = await index.getVenusProduct(data);
				if (result.code == 1) {
					console.log(result, '123')
					this.list = result.data.result.data
					this.type = result.data.result.type
					this.navbarItems_1[1].text = result.data.result.title
				}
			},
			// 会员办卡
			memberCard(item1,item) {
				console.log(item1,item)
				uni.navigateTo({
					url: '/page_venues/pages/venuesDetail/memberCard/memberCard?id=' + item1.id +
						'&venue_name=' +
						item.venue.venue_name +
						'&venue_id=' +
						item.venue.id,

				})
			},
			// 门票购买
			ticketModule(item1,item) {
				console.log(item1,item)
				uni.navigateTo({
					url: '/page_venues/pages/venuesDetail/ticketModule/ticketModule?id=' + item1.id +
						'&venue_name=' +
						item.venue.venue_name +
						'&venue_id=' +
						item.venue.id,

				})
			},
			// 场地
			cdClick(item1,item) {
				var _this = this
				var now = new Date()
				var h = now.getHours(); //获取当前小时数(0-23)
				var min = now.getMinutes(); //获取当前分钟数(0-59)
				if (h < 10) {
					h = '0' + h
				}
				if (min < 10) {
					min = '0' + min
				}
				this.time_list = h + ':' + min
				let data = {
					app_id: this.$https.weixinAppId,
					project_id: getApp().globalData.projectId,
					product_id: item1.id
				};
				train.getCourtProduct(data).then(result => {
					// this.each_num.open_time_end = result.data.result.open_time_end
					// this.each_num.open_time_start = result.data.result.open_time_start
					let open_time_end = result.data.result.open_time_end
					let open_time_start = result.data.result.open_time_start
					if (this.time_list > open_time_start && this.time_list < open_time_end) {
						uni.navigateTo({
							url: '/page_venues/pages/venuesDetail/stadium/stadium?venue_id=' + item.venue
								.id +
								"&id=" +
								item1.id +
								"&court_id=" +
								item1.id +
								"&windows=" +
								item1.windows +
								"&name=" +
								item1.court_name
						})
					}
				})

			},
			// <!-- 培训报班 -->
			trainlist(item1,item) {
				uni.navigateTo({
					url: '/pages_other/train/train?id=' + item1.id +
						'&venue_name=' +
						item.venue.venue_name +
						'&venue_id=' +
						item.venue.id,
				})
			},
			// 赛事报名
			racelist(item1,item) {
				uni.navigateTo({
					url: '/pages/race/race?id=' + item1.id +
						'&venue_name=' +
						item.venue.venue_name +
						'&venue_id=' +
						item.venue.id +
						'&cate_type=' +
						'enroll'+
						'&windows=' +
						item1.windows,
				})
			},
		},

	}
</script>

<style scoped lang="scss">
	.control {
		width: 100%;
		height: 100%;
		background-color: #ffffff;

		.control_item {
			width: 100%;
			height: 100%;

			padding: 20rpx 30rpx;
			box-sizing: border-box;
			background-color: #ffffff;

			//门票购买
			.item-list {
				width: 100%;
				height: 100%;
				margin-bottom: 30rpx;
				border-radius: 20rpx;
				background: url('https://jiangsudiantuo2022.oss-cn-hangzhou.aliyuncs.com/img/805a5d9ceb73d4e3c9cd09b9a456e7f4f97b472c.png') 0% no-repeat;
				background-position: center top;
				// background-size: 100% 100%;

				.list-title {
					font-size: 32rpx;
					font-weight: 500;
					color: #003a96;
					margin-left: 3.5%;
					padding-top: 20rpx;
				}

				.font_2 {
					font-size: 22rpx;
					color: #888888;
					margin-left: 3.5%;
					margin-top: 10rpx;
				}

				.venues-list {
					display: flex;
					flex-wrap: wrap;
					// justify-content: space-between;

					.venues-item {
						width: 31%;
						// background-color: white;
						border-radius: 10rpx;
						// overflow: hidden;
						margin-top: 25rpx;
						margin-left: 2%;
						// box-shadow: 0px 0px 5px #d3d3d3;

						.detail {
							box-sizing: border-box;
							padding: 10rpx 10rpx 20rpx 10rpx;

							.name {
								font-size: 26rpx;
								margin-bottom: 10rpx;
								color: #333333;
							}

							.timer {
								font-size: 23rpx;
								color: #cecece;
								height: 40rpx;
							}

							.tag-list {
								/deep/ .u-tag {
									height: 37rpx;
									margin-right: 10rpx !important;

									.u-tag__text {
										font-size: 23rpx !important;
									}
								}
							}
						}
					}
				}
			}

			// 会员办卡
			.item-list1 {
				width: 100%;
				height: 100%;
				margin-bottom: 30rpx;
				border-radius: 20rpx;
				background: url('https://jiangsudiantuo2022.oss-cn-hangzhou.aliyuncs.com/img/805a5d9ceb73d4e3c9cd09b9a456e7f4f97b472c.png') 0% no-repeat;
				background-position: center top;
				// background-size: 100% 100%;

				.list-title {
					font-size: 32rpx;
					font-weight: 500;
					color: #003a96;
					margin-left: 3.5%;
					padding-top: 20rpx;
				}

				.font_2 {
					font-size: 22rpx;
					color: #888888;
					margin-left: 3.5%;
					margin-top: 10rpx;
				}

				.venues-list {
					display: flex;
					flex-wrap: wrap;
					// justify-content: space-between;

					.venues-item {
						width: 45%;
						// background-color: white;
						border-radius: 10rpx;
						// overflow: hidden;
						margin-top: 25rpx;
						margin-left: 3%;
						// box-shadow: 0px 0px 5px #d3d3d3;

						.detail {
							box-sizing: border-box;
							padding: 10rpx 10rpx 20rpx 10rpx;

							.name {
								font-size: 26rpx;
								margin-bottom: 10rpx;
								color: #333333;
							}

							.timer {
								font-size: 23rpx;
								color: #cecece;
								height: 40rpx;
							}

							.tag-list {
								/deep/ .u-tag {
									height: 37rpx;
									margin-right: 10rpx !important;

									.u-tag__text {
										font-size: 23rpx !important;
									}
								}
							}
						}
					}
				}
			}

			// 场地预定
			.item-list2 {

				width: 100%;
				height: 100%;
				margin-bottom: 30rpx;
				border-radius: 20rpx;
				background: url('https://jiangsudiantuo2022.oss-cn-hangzhou.aliyuncs.com/img/805a5d9ceb73d4e3c9cd09b9a456e7f4f97b472c.png') 0% no-repeat;
				background-position: center top;
				// background-size: 100% 100%;

				.list-title {
					font-size: 32rpx;
					font-weight: 500;
					color: #003a96;
					margin-left: 3.5%;
					padding-top: 20rpx;
				}

				.font_2 {
					font-size: 22rpx;
					color: #888888;
					margin-left: 3.5%;
					margin-top: 10rpx;
				}

				.venues-list {
					display: flex;
					flex-wrap: wrap;
					// justify-content: space-between;

					.venues-item {
						width: 21%;
						// background-color: white;
						border-radius: 10rpx;
						// overflow: hidden;
						margin-top: 25rpx;
						margin-left: 3%;
						// box-shadow: 0px 0px 5px #d3d3d3;

						.detail {
							box-sizing: border-box;
							padding: 10rpx 10rpx 20rpx 10rpx;

							.name {
								font-size: 26rpx;
								margin-bottom: 10rpx;
								color: #333333;
							}

							.timer {
								font-size: 23rpx;
								color: #cecece;
								height: 40rpx;
							}

							.tag-list {
								/deep/ .u-tag {
									height: 37rpx;
									margin-right: 10rpx !important;

									.u-tag__text {
										font-size: 23rpx !important;
									}
								}
							}
						}
					}
				}
			}

			// 培训报班
			.item-list3 {

				width: 100%;
				height: 100%;
				margin-bottom: 30rpx;
				border-radius: 20rpx;
				background: url('https://jiangsudiantuo2022.oss-cn-hangzhou.aliyuncs.com/img/805a5d9ceb73d4e3c9cd09b9a456e7f4f97b472c.png') 0% no-repeat;
				background-position: center top;
				// background-size: 100% 100%;

				.list-title {
					font-size: 32rpx;
					font-weight: 500;
					color: #003a96;
					margin-left: 3.5%;
					padding-top: 20rpx;
				}

				.font_2 {
					font-size: 22rpx;
					color: #888888;
					margin-left: 3.5%;
					margin-top: 10rpx;
				}

				.venues-list {
					display: flex;
					flex-wrap: wrap;
					// justify-content: space-between;

					.venues-item {
						width: 31%;
						// background-color: white;
						border-radius: 10rpx;
						// overflow: hidden;
						margin-top: 25rpx;
						margin-left: 2%;
						// box-shadow: 0px 0px 5px #d3d3d3;

						.detail {
							box-sizing: border-box;
							padding: 10rpx 10rpx 20rpx 10rpx;

							.name {
								font-size: 26rpx;
								margin-bottom: 10rpx;
								color: #333333;
							}

							.timer {
								font-size: 23rpx;
								color: #cecece;
								height: 40rpx;
							}

							.tag-list {
								/deep/ .u-tag {
									height: 37rpx;
									margin-right: 10rpx !important;

									.u-tag__text {
										font-size: 23rpx !important;
									}
								}
							}
						}
					}
				}
			}

			// 赛事报名
			.item-list4 {

				width: 100%;
				height: 100%;
				margin-bottom: 30rpx;
				border-radius: 20rpx;
				background: url('https://jiangsudiantuo2022.oss-cn-hangzhou.aliyuncs.com/img/805a5d9ceb73d4e3c9cd09b9a456e7f4f97b472c.png') 0% no-repeat;
				background-position: center top;
				// background-size: 100% 100%;

				.list-title {
					font-size: 32rpx;
					font-weight: 500;
					color: #003a96;
					margin-left: 3.5%;
					padding-top: 20rpx;
				}

				.font_2 {
					font-size: 22rpx;
					color: #888888;
					margin-left: 3.5%;
					margin-top: 10rpx;
				}

				.venues-list {
					display: flex;
					flex-wrap: wrap;
					// justify-content: space-between;

					.venues-item {
						width: 100%;
						// background-color: white;
						border-radius: 10rpx;
						// overflow: hidden;
						margin-top: 25rpx;
						margin-left: 2%;
						// box-shadow: 0px 0px 5px #d3d3d3;

						.detail {
							box-sizing: border-box;
							padding: 10rpx 10rpx 20rpx 10rpx;

							.name {
								font-size: 26rpx;
								margin-bottom: 10rpx;
								color: #333333;
							}

							.timer {
								font-size: 23rpx;
								color: #cecece;
								height: 40rpx;
							}

							.tag-list {
								/deep/ .u-tag {
									height: 37rpx;
									margin-right: 10rpx !important;

									.u-tag__text {
										font-size: 23rpx !important;
									}
								}
							}
						}
					}
				}
			}
		}
	}
</style>
